<template>
  <BasePanel title="施工许可信息" :one="true">

    <table class="show-table">
      <colgroup>
        <col width="136">
        <col width="275">
        <col width="136">
        <col width="275">
      </colgroup>
      <tr>
        <td class="key">工程名称</td>
        <td colspan="3">{{detail?.buiPrjName}}</td>

      </tr>
      <tr>
        <td class="key">施工许可证编号</td>
        <td>{{detail?.buiLicNum}}</td>
        <td class="key">合同金额 (万元)</td>
        <td>{{detail?.contractMoney}}</td>
      </tr>

      <tr>
        <td class="key">建设规模</td>
        <td colspan="3">{{detail?.prjSize}}</td>
      </tr>
      <tr>
        <td class="key">建设单位</td>
        <td>{{detail?.buildCorp}}</td>
        <td class="key">建设单位项目负责人</td>
        <td>{{detail?.buildPerson}}</td>
      </tr>
      <tr>
        <td class="key">勘察单位</td>
        <td>{{detail?.surveyCorp}}</td>
        <td class="key">勘察单位项目负责人</td>
        <td>{{detail?.surveyPerson}}</td>
      </tr>
      <tr>
        <td class="key">设计单位</td>
        <td>{{detail?.designCorp}}</td>
        <td class="key">设计单位项目负责人</td>
        <td>{{detail?.designPerson}}</td>
      </tr>

      <tr>
        <td class="key">施工单位</td>
        <td>{{detail?.constructionCorp}}</td>
        <td class="key">施工单位项目负责人</td>
        <td>{{detail?.constructionPerson}}</td>
      </tr>
      <tr>
        <td class="key">监理单位</td>
        <td>{{detail?.supervisorCorp}}</td>
        <td class="key">监理单位项目负责人</td>
        <td>{{detail?.supervisorPerson}}</td>
      </tr>

      <tr>

        <td class="key">计划开工日期</td>
        <td>{{ parseTime(detail?.bargainStartDate)}}</td>
        <td class="key">计划竣工日期</td>
        <td>{{ parseTime(detail?.bargainEndDate)}}</td>
      </tr>
      <tr>
        <td class="key">发证机关</td>
        <td>{{detail?.releaseUnit}}</td>
        <td class="key">发证日期</td>
        <td>{{ parseTime(detail?.releaseTime)}}</td>
      </tr>
    </table>
  </BasePanel>
</template>

<script lang="ts">

interface Model{
  bargainEndDate?:string;//合同工期 结束时间	(date-time)
  bargainStartDate?:string;//合同工期 开始时间	string(date-time)
  buiLicNum?:string	;//施工许可证编号
  buiPrjName?:string;//工程名称
  buildCorp?:string;//	建设单位
  buildPerson?:string;//	建设负责人
  constructionCorp?:string;//	施工单位
  constructionPerson?:string;//	施工负责人
  contractMoney?:string;//合同金额(万元)
  designCorp?:string	;//设计单位
  designPerson?:string	;//设计负责人
  prjSize?:string;//建设规模
  releaseTime?:string;//发证日期(date-time)
  releaseUnit?:string;//发证机关
  sgxkId?:string;//	id
  supervisorCorp?:string;//	监理单位
  supervisorPerson?:string;//	监理负责人
  surveyCorp?:string;//	勘察单位
  surveyPerson?:string;//	勘察负责人
}
import {defineComponent, inject, onMounted, ref} from 'vue';
import {BasePanel} from '/@/components/panelComponent/index';
import { getprjSgxkApi} from '/@/api/pro';
 import { parseTime } from '/@/utils';


export default defineComponent({
  components: { BasePanel },
  setup() {
    const applyId = inject('applyId') as string;
    const detail = ref<Model | undefined | null>();
    const init = async() => {
      let { data } = await getprjSgxkApi({applyId});
      detail.value = data
    }
    onMounted(init);
    return {
      detail, parseTime
    }
  },
})
</script>

<style lang="less" scoped>
::v-deep(.base-panel) {
  .base-panel__header {
    margin-bottom: 13px;
  }
}

.ant-tabs {
  margin-top: -60px;

  ::v-deep(.ant-tabs-nav-scroll) {
    display: flex;
    flex-direction: row-reverse;
  }
}

.show-table{
  width: 100%;
  border: 1px solid #f0f0f0;

  tr{
    td{
      height: 50px;
      padding: 5px 15px;
      vertical-align: center;
      border: 1px solid #EAEAEA;

      &.key{
        background: #F3F3F3;
      }

    }
  }
}
</style>
